<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form action="" method="post">
		用户名：	<input type="text" name="username" id="username"/><br />
		密码：	<input type="password" name="pwd" id="pwd" /><br />
		密码：	<input type="tel" name="phone" id="phone" pattern="^(\+86)1/d{10}"/><br />
			<input type="submit" value="提交"/>
		</form>
	<script>
			/* 
				1.oninput：监听当前指定元素的内容
				2.onkeyup:键盘弹起的时候触发；
				3.oninvalid:验证不通过触发	
			 */
			document.getElementById("username").oninput=
			function(){
				console.log("oninput事件："+this.value)
			}
			document.getElementById("username").onkeyup=
			function(){
				console.log("onkeyup事件："+this.value)
			}	
			document.getElementById("phone").oninvalid=
			function(){
				console.log("oninvalid事件："+this.value)
				/* 
					setCustomValidity():改变提示信息
				 */
				this.setCustomValidity("ssss")
			}
	</script>	
	</body>
	
	
</html>